import React,{Component} from 'react';
import { Pagination } from 'antd';
import PropTypes from 'prop-types';
import url from '../../component/posturl/BaseUrl';
import classNames from 'classnames';
import './list.less';
const prefix = 'news-list';
class List extends Component{
    state = {
        current: 1,
    }
    onChange = (page,pagesize) => {
        console.log(page,pagesize);
        this.setState({
            current: page,
        });
    }
    render(){
        let current = this.state.current;
        let listSource = this.props.listSource?this.props.listSource.slice((current-1)*10,current*10):null;//用来进行分页，每页显示十条数据
        let total = this.props.listSource?this.props.listSource.length:10;
        let contentStyle = this.props.contentStyle;
        let isReferral = this.props.isReferral;
        let category = this.props.category;
        let list = listSource?listSource.map((value,index)=>{
            return(
                <a href={isReferral?`/details?id=${value.id}&type=referral&category=${category}`:`/details?id=${value.id}&category=${value.category}`} className={prefix+"-container"} key={index}>
                    <span className={prefix+"-img-container"} style={{background:`url(${url}/official/view?key=${value.images}) no-repeat center`,backgroundSize:"100% 100%"}}></span>
                    <span className={prefix+"-content"} style={contentStyle?contentStyle:null}>
                        <span className={prefix+"-title clearfix"}>
                            <p className={prefix+"-over-flow"}>{value.title}</p>
                            <p>{value['create_time']}</p>
                        </span>
                        <p className={prefix+"-summary"}>{value.summary}</p>
                    </span>
                </a>
            )
        }):null;
        return(
            <div className={classNames(prefix,"clearfix")}>
                {list}
                <Pagination current={this.state.current} onChange={this.onChange} total={total} className={prefix+'-pagination'}/>
            </div>
        )
    }
}
export default List;
List.propTypes = {
    listSource:PropTypes.array.isRequired,
    isReferral:PropTypes.oneOf([true,false]).isRequired,//是否属于梅奥转诊分类下的界面
    contentStyle:PropTypes.object,
    category:PropTypes.number
}